<template>
  <!-- TableColumn 组件本身不渲染任何元素，它只是一个配置提供者 -->
  <slot></slot>
</template>

<script lang="ts" setup>
import { ref, computed, onMounted, onUnmounted, inject, provide, watch, Ref } from 'vue';
import type { TableColumnProps, TableContext } from './types';

// Props
const props = defineProps<TableColumnProps>();

// 获取表格上下文
const tableContext = inject<Ref<TableContext> | undefined>('tableContext');

// 计算属性获取实际的表格上下文
const table = computed(() => tableContext?.value);

// 获取父列配置，提供默认值以避免警告
const parentColumnConfig = inject<{
  registerChildColumn: (column: TableColumnProps) => void;
  unregisterChildColumn: (column: TableColumnProps) => void;
}>('columnConfig', {
  registerChildColumn: () => {},
  unregisterChildColumn: () => {}
});

// 内部状态
const columnConfig = ref<TableColumnProps>({
  ...props,
  children: []
});

// 子列配置引用
const childrenColumns = ref<TableColumnProps[]>([]);

// 向父列注册子列
const registerChildColumn = (childColumn: TableColumnProps) => {
  if (!childrenColumns.value.includes(childColumn)) {
    childrenColumns.value.push(childColumn);
    columnConfig.value.children = [...childrenColumns.value];
  }
};

// 从父列注销子列
const unregisterChildColumn = (childColumn: TableColumnProps) => {
  const index = childrenColumns.value.indexOf(childColumn);
  if (index > -1) {
    childrenColumns.value.splice(index, 1);
    columnConfig.value.children = [...childrenColumns.value];
  }
};

// 提供子列注册方法给子组件
provide('columnConfig', {
  registerChildColumn,
  unregisterChildColumn
});

// 计算属性
const mergedFixed = computed(() => {
  if (props.fixed === true) {
    return 'left';
  }
  return props.fixed;
});

// 注册列
onMounted(() => {

  // 向父列注册自己（如果存在父列）
  if (parentColumnConfig && parentColumnConfig.registerChildColumn) {
    parentColumnConfig.registerChildColumn(columnConfig.value);
  }

  // 向表格上下文注册自己
  if (table.value && table.value.registerColumn) {
    table.value.registerColumn(columnConfig.value);
  } else {
  }
});

// 注销列
onUnmounted(() => {
  // 从父列注销自己（如果存在父列）
  if (parentColumnConfig && parentColumnConfig.unregisterChildColumn) {
    parentColumnConfig.unregisterChildColumn(columnConfig.value);
  }

  // 从表格上下文注销自己
  if (table.value && table.value.unregisterColumn) {
    table.value.unregisterColumn(columnConfig.value);
  }

  // 清理子列
  childrenColumns.value = [];
  columnConfig.value.children = [];
});

// 监听props变化
const propsWatchers: (() => void)[] = [];

// 监听fixed属性变化
propsWatchers.push(
  watch(() => props.fixed, (newValue) => {
    columnConfig.value.fixed = mergedFixed.value;
  })
);

// 监听width属性变化
propsWatchers.push(
  watch(() => props.width, (newValue) => {
    columnConfig.value.width = newValue;
  })
);

// 监听sortable属性变化
propsWatchers.push(
  watch(() => props.sortable, (newValue) => {
    columnConfig.value.sortable = newValue;
  })
);

// 监听showOverflowTooltip属性变化
propsWatchers.push(
  watch(() => props.showOverflowTooltip, (newValue) => {
    columnConfig.value.showOverflowTooltip = newValue;
  })
);

// 清理监听器
onUnmounted(() => {
  propsWatchers.forEach(watcher => watcher());
});

// 暴露配置给父组件
defineExpose({
  columnConfig
});
</script>

<style lang="scss" scoped>
/* TableColumn组件本身不需要样式，样式在Table组件中定义 */
</style>